<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
 	<link type="text/css" rel="stylesheet" media="all" href="/css/bootstrap.css" />
	<link type="text/css" rel="stylesheet" media="all" href="/css/bootstrap-responsive.css" />
	<link type="text/css" rel="stylesheet" media="all" href="/css/jquery-ui-1.8.17.custom.css" />
	<style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
      .sidebar-nav {
        padding: 9px 0;
      }
    </style>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
        <title>Person Management</title>
    </head>
    <body>
    
    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="#">YamaShinigami</a>
          <div class="nav-collapse">
            <ul class="nav">
              <li class="active"><a id="home_selector" href="/#">Home</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>
    
    <div class="container-fluid">
      <div class="row-fluid">
        <div class="span3">
          <div class="well sidebar-nav">
            <ul class="nav nav-list">
              <li class="nav-header">Actions</li>
              <li class="active"><a href="/person">Create</a></li>
              <li><a href="/person/search">Search</a></li>
              <li><a href="/person/result">List</a></li>
            </ul>
          </div><!--/.well -->
        </div><!--/span-->
        <div class="span9">
        <form id="person" class="well form-horizontal" action="" method="post" >
            <table  border="0" cellpadding="5px" cellspacing="3px">
                <tr>
                    <td colspan="3">
                        <strong>Person</strong>
                    </td>
                </tr>                
                <tr>
                    <td>FirstName</td>
                    <td colspan="2"><input type="text" name="firstName" id="firstName" value="$!person.firstName" tabindex="1" maxlength="20"/>
                    	#springBind("person.firstName")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr>
                    <td>LastName</td>
                    <td colspan="2"><input type="text" name="lastName" id="lastName" value="$!person.lastName" tabindex="2" maxlength="20"/>
                    	#springBind("person.lastName")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr>
                    <td>Sex</td>
                    <td colspan="2">
                    	<input type="radio" id="gender" name="gender" value="true">Male</input>
                    	<input type="radio" id="gender" name="gender" value="false">Female</input>
                    	#springBind("person.gender")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr>
					<td>BirthDate</td>
					<td><input type="text" name="birthDate" value="$!person.birthDate" size="20" id="datepicker"/></td>
				</tr>	
                <tr>
                    <td>
                    	<!--  select id="status" name="status" >
                    		<option value="single">Single</option>
                    		<option value="married">Married to</option>
                    		<option value="inRelation">in RelationShip with</option>
                    	</select-->
                    	<input type="hidden" name="status" value="none"/>
                    	#springBind("person.status")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                    
                    <td><!-- 
                        <input type="text" id="personRelation" value="" size="15" disabled="true" onfocus="this.blur()"/>
                        &nbsp;&nbsp;
                        <input type="hidden" name="relation.id" id="relation" value=""/>
                        <input type="button" value="View" onclick="javascript:window.open('listPerson/'+document.getElementById('gender').value,'cats','scrollbars=yes,status=no,width=300,height=300')"/>
                     --></td>
 					  #springBind("person.relation.id")
                      <font color="red" >#springShowErrors("<br/>" "")</font>
                </tr>
                
				<tr>
                    <td>Address</td>
                    <td colspan="2">
                    	<input type="text" name="address" id="address" value="$!person.address" tabindex="4" maxlength="20"/>
                    	#springBind("person.address")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr>
                    <td colspan="3">
                        <input type="submit" class="btn btn-primary" value="Submit"/>
                        <input type="reset" class="btn btn-danger" tabindex="21"/>
                    </td>
                </tr>
            </table>
        </form>
        </div>
		</div>
		<hr>

      <footer>
        <p>&copy; YamaShinigami 2012</p>
      </footer>
		
		</div>
		<script src="/js/jquery-1.7.1.min.js"></script>
		<script src="/js/jquery-ui-1.8.17.custom.min.js"></script>
		<script src="/js/bootstrap.js"></script>
		<script>
			$(function() {
				$("#datepicker").datepicker();
			});
		</script>
	</body>
</html>